<!-- Generated template for the ShopEvaluateComponent component -->
<ion-content>
<div *ngIf="flag" class="box5">
  <ion-list class="cont" *ngFor="let list of shopList" (tap)="toDetail(list)">
    <ion-item class="avator">
      <div style="display:flex;width:100%;">
        <div style="flex:2">
          <ion-thumbnail item-start>
            <img src="{{picrooturl}}{{list.service_img}}" alt="">
          </ion-thumbnail>
          <span class="nailname">{{list.service_name}}</span>
        </div>
        <div class="shopStar" style='display:flex;flex:1'>
          <div class="stars">
            <!-- {{list.remark_starts | json}} {{isArray(list.remark_starts)}} {{list | json}} -->
            <!-- <span *ngIf="isArray(list.remark_starts)">
              {{list.remark_starts.length}}
              <img *ngIf="list.remark_starts.length>=1" src="/assets/img/Comment/xingxing@2x.png" alt="">
              <img *ngIf="list.remark_starts.length>=2" src="/assets/img/Comment/xingxing@2x.png" alt="">
              <img *ngIf="list.remark_starts.length>=3" src="/assets/img/Comment/xingxing@2x.png" alt="">
              <img *ngIf="list.remark_starts.length>=4" src="/assets/img/Comment/xingxing@2x.png" alt="">
              <img *ngIf="list.remark_starts.length==5" src="/assets/img/Comment/xingxing@2x.png" alt="">
              <img *ngIf="list.remark_starts.length<2" src="/assets/img/Comment/xingxingwei@2x.png" alt="">
              <img *ngIf="list.remark_starts.length<3" src="/assets/img/Comment/xingxingwei@2x.png" alt="">
              <img *ngIf="list.remark_starts.length<3" src="/assets/img/Comment/xingxingwei@2x.png" alt="">
              <img *ngIf="list.remark_starts.length<5" src="/assets/img/Comment/xingxingwei@2x.png" alt="">
              <img src="/assets/img/Comment/xingxingwei@2x.png" alt="">
            </span> -->
            <!-- <img src="/assets/img/Comment/xingxingwei@2x.png" alt=""> -->
            <!-- 这里是注销部分 -->



            <ng-container *ngIf="isArray(list.remark_starts)">
              <span *ngFor='let star of five;let i = index'>
                <ng-container>
                  <img *ngIf="list.remark_starts[i]" src="/assets/img/Comment/xingxing@2x.png" alt="">
                  <img *ngIf="!list.remark_starts[i]" src="/assets/img/Comment/xingxingwei@2x.png" alt="">
                </ng-container>

              </span>
            </ng-container>
          </div>
          <span style="color:red">{{evaluate[list.remark_starts?.length-1]}}</span>
        </div>
      </div>



      <!-- <div *ngIf='list.remark_starts' *ngFor="let star of list.remark_starts">{{star}}</div> -->

    </ion-item>



    <ion-item class="imglist">
      <ion-item class="avater">
        <ion-avatar item-start>
          <img src="{{picrooturl}}{{list.user_avator}}">
        </ion-avatar>
        <span class="name">{{list.remark_name}}</span>
        <span class="time">{{list.remark_time.split(' ')[0].split("-").join(".")}}</span>
      </ion-item>

      <p class="conten">{{list.remark_content}}</p>
      <ion-item class="wb">
        <img *ngIf='list.remark_img_first' src="{{picrooturl}}{{list.remark_img_first}}" style="width:30%" (click)="goToProductDetailPage()">
        <img *ngIf='list.remark_img_second' src="{{picrooturl}}{{list.remark_img_second}}" style="width:30%;margin-left:3%;">
        <img *ngIf='list.remark_img_third' src="{{picrooturl}}{{list.remark_img_third}}" style="width:30%;margin-left:3%;">
      </ion-item>

    </ion-item>
    <div class="respond" *ngIf="list.replay_content!=''">
      <span class="blue">商家回应 :</span>
      <span class="text">&nbsp;{{list.replay_content}}</span>
    </div>
  </ion-list>
  <div *ngIf="bottom1" text-center class="bot">已经加载全部啦 ~</div>
    <ion-infinite-scroll (ionInfinite)="doInfinite($event)" threshold="100px">
      <ion-infinite-scroll-content loadingText="加载中..."></ion-infinite-scroll-content>
    </ion-infinite-scroll>
</div>
<!--  没有相关订单的时候 显示的数据 -->
<div class="hasNoMsg" *ngIf="!flag" text-center>
  <img style='width:290px;height:170px;margin-top:100px;' src="assets/img/Comment/dingdankong@2x.png" alt="">
  <p style='color:#aaa;font-size:1.4rem;'>您还没有服务评论，加油喽</p>
</div>
</ion-content>
<!--<ion-list class="cont">
  <ion-item class="avater">
    <ion-avatar item-start>
      <img src="http://www.mengfeisi.com.cn/Uploads/nail_album/2017-03-07/1_328.jpg">
    </ion-avatar>
    <span>小喵喵美甲师</span><span class="time">2017.10.24</span>
    <div class="shopStar">
      <ul>
        <li>
          <ion-icon ios="ios-star" md="md-star"></ion-icon>
        </li>
        <li>
          <ion-icon ios="ios-star" md="md-star"></ion-icon>
        </li>
        <li>
          <ion-icon ios="ios-star" md="md-star"></ion-icon>
        </li>
        <li>
          <ion-icon ios="ios-star" md="md-star"></ion-icon>
        </li>
        <li>
          <ion-icon name="star" ios="ios-star"></ion-icon>
        </li>
      </ul>
    </div>
  </ion-item>
  <div class="evaluate">
    <span class="blue">评论 :</span> <span class="text">&nbsp;老板做的很漂亮啊！做的也很认真，颜色很正。下次还回来光顾的！</span>
  </div>
  <ion-item class="imglist">
    <img src="http://www.mengfeisi.com.cn/Uploads/nail_album/2017-03-07/1_328.jpg" style="width:30%" (click)="goToProductDetailPage()">
    <img src="http://www.mengfeisi.com.cn/Uploads/nail_album/2017-03-07/2_328.jpg" style="width:30%;margin-left:3%;">
    <img src="http://www.mengfeisi.com.cn/Uploads/nail_album/2017-03-07/3_328.jpg" style="width:30%;margin-left:3%;">
  </ion-item>
  <div class="respond">
    <span class="blue">商家回应 :</span><span class="text">&nbsp;老板做的很漂亮啊！做的也很认真，颜色很正。下次还回来光顾的！</span>
  </div>
</ion-list>-->